<template>
	<view style="width: 100%;height: 100vh;background-color: #AEE2DA;">
		<cu-custom bgColor="bg-blue" :isBack="true"><block slot="content">抽取结果</block></cu-custom>
		<view style="width: 100%;position: relative;height: 1300upx;background-color: #AEE2DA;">
			<view style="">
				<image :src="Imgbase + '/nreword_title.png'" style="width: 100%;" mode="widthFix"></image>
			</view>
			<view :style="{background:'url('+Imgbase+'/nreword_con.png) no-repeat','background-size':'100% 100%',}"
			style="width: 90%;margin-left: 5%;margin-top:-240upx;
			height: 900upx;position: relative;padding:40upx" v-if="count == 10">
			<block v-for="(item,index) in list">
			<view class="cu-item shadow"
			style="position: relative;width: 29%;float: left;padding-bottom: 0rpx;border:2px solid #f68c50;border-radius:10upx;
			margin: 10rpx;">
				<view class="image" style="width: 100%;">
					<image :src="item.adimage"
					 mode="widthFix" style="min-height: 70px;"></image>
				</view>
			</view>
			</block>
			</view>
			<view :style="{background:'url('+Imgbase+'/nreword_con.png) no-repeat','background-size':'100% 100%',}"
			style="width: 90%;margin-left: 5%;margin-top:-240upx;
			height: 900upx;position: relative;padding:40upx;" v-if="count == 1">
			<view style="width:100%;height:230upx;"></view>
			<block v-for="(item,index) in list">
			<view class="cu-item shadow"
			style="position: relative;width: 40%;float: left;padding-bottom: 0rpx;border:2px solid #f68c50;border-radius:10upx;
			margin: 10rpx;margin-left:30%;">
				<view class="image" style="width: 100%;">
					<image :src="item.adimage"
					 mode="widthFix" style="min-height: 70px;"></image>
				</view>
			</view>
			</block>
			</view>
			<view :style="{background:'url('+Imgbase+'/nreword_con.png) no-repeat','background-size':'100% 100%',}"
			style="width: 90%;margin-left: 5%;margin-top:-240upx;
			height: 900upx;position: relative;padding:40upx;" v-if="count == 3">
			<view style="width:100%;height:140upx;"></view>
			<view class="cu-item shadow"
			style="position: relative;width: 40%;float: left;padding-bottom: 0rpx;border:2px solid #f68c50;border-radius:10upx;
			margin: 10rpx;margin-left:5%;">
				<view class="image" style="width: 100%;">
					<image :src="list[0].adimage"
					 mode="widthFix" style="min-height: 70px;"></image>
				</view>
			</view>
			<view class="cu-item shadow"
			style="position: relative;width: 40%;float: left;padding-bottom: 0rpx;border:2px solid #f68c50;border-radius:10upx;
			margin: 10rpx;margin-left:5%;">
				<view class="image" style="width: 100%;">
					<image :src="list[1].adimage"
					 mode="widthFix" style="min-height: 70px;"></image>
				</view>
			</view>
			<view class="cu-item shadow"
			style="position: relative;width: 40%;float: left;padding-bottom: 0rpx;border:2px solid #f68c50;border-radius:10upx;
			margin: 10rpx;margin-left:30%;">
				<view class="image" style="width: 100%;">
					<image :src="list[2].adimage"
					 mode="widthFix" style="min-height: 70px;"></image>
				</view>
			</view>
			</view>
			<image @click="continueBuy()"  :src="Imgbase + '/nreword_btn.png'" v-if="count==10"
			style="width: 30%;position: absolute;right: 16%;top: 78%;" mode="widthFix">
			</image>
			<image @click="continueBuy()"  :src="Imgbase + '/nreword_btn.png'"  v-if="count!=10"
			style="width: 30%;position: absolute;right: 35%;top: 78%;" mode="widthFix">
			</image>
			<view style="clear: both;"></view>
			<view class="">
				<image :src="Imgbase + '/nreword_txt.png'" style="width: 50%;margin-left:10%;margin-top:2%;" mode="widthFix"></image>
			</view>
		</view>
		<view class="cu-load load-modal" v-if="loadModal">
			<image src="/static/icon.jpg" mode="aspectFit"></image>
			<view class="gray-text">加载中...</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				Imgbase:getApp().globalData.Imgbase,
				list:[],
				count:0,
				timer: null,
				loadModal: false,
				mes:'奖池数量不足',
				logdata:0,
			};
		},
		onLoad(options) {
			let _this = this;
			if(options.logid != null){
				_this.list = JSON.parse(options.logid); 
				_this.count = _this.list.length;
				/*uni.request({
					url: _this.$globals.apibase+'/api/Luckorder/getReword',
					data: {
						token: uni.getStorageSync('token'),
						logid: options.logid,
					},
					method: 'POST',
					header: {
						'content-type': 'application/json'
					},
					success: (res) => {
						if(res.data.code == '401'){
							uni.setStorageSync('token', '');
							_this.$uniApi.trylogin();
						}
						if(res.data.code == '1'){
							_this.count = res.data.data.count
							for(let i=0;i<res.data.data.list.length;i++){
								_this.list = _this.list.concat(res.data.data.list[i])
							}
						}
						if(res.data.code == '0'){
							uni.showToast({
								icon: 'none',
								title: res.data.msg
							});
						}
					}
				});*/
			}
			if(options.out_trade_no != null){
				_this.loadModal = true;
				this.timer = setInterval( () => {
				    uni.request({
				    	url: _this.$globals.apibase+'/api/Luckorder/getWechatReword',
				    	data: {
				    		token: uni.getStorageSync('token'),
				    		out_trade_no: options.out_trade_no,
				    	},
				    	method: 'POST',
				    	header: {
				    		'content-type': 'application/json'
				    	},
				    	success: (res) => {
				    		if(res.data.code == '401'){
				    			// uni.setStorageSync('token', '');
				    			// _this.$uniApi.trylogin();
				    		}
				    		if(res.data.code == '1'){
								if(res.data.data.state == 1){
									_this.logdata = res.data.data.logdata;
									if(res.data.data.logdata == 0){
										_this.count = res.data.data.count
										for(let i=0;i<res.data.data.list.length;i++){
											_this.list = _this.list.concat(res.data.data.list[i])
										}
									}
									if(res.data.data.logdata == -1){
										_this.count = 0;
										_this.mes = res.data.data.mes;
									}
									if(res.data.data.logdata == -2){
										_this.count = 0;
										_this.mes = res.data.data.mes;
									}
									clearTimeout(_this.timer);
									_this.timer = null; 
									_this.loadModal = false;
								}
				    		}
				    		if(res.data.code == '0'){
				    			uni.showToast({
				    				icon: 'none',
				    				title: res.data.msg
				    			});
				    		}
				    	}
				    });	
				}, 1000)
			}
		},
		onUnload() {
			if(this.timer) {  
				clearTimeout(this.timer);  
				this.timer = null;  
			}  
		},
		methods: {
			tobackpack(){
				uni.reLaunch({
					url: `/pages/index/index?mes=backpack`
				});
			},
			continueBuy(){
				uni.navigateBack();
			},
		}
	}
</script>

<style>
	.fl{
		float: left;
	}
	.fr{
		float: right;
	}
</style>
